﻿<UserControl x:Class="VRacer.Controls.GBPlayerPath"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:cnv="clr-namespace:VRacer.Client.Converters" 
    xmlns:to="clr-namespace:VRacer.Controls"         
             >
    
    <UserControl.Resources>
        <cnv:PositionToPointConverter x:Key="PositionConverter" />
        
        <Style x:Name="_ellipses" x:Key="MoveEllipseStyle" TargetType="Ellipse">
            <Setter Property="Opacity" Value="0.5" />
            <Setter Property="Margin" Value="1" />
            <Setter Property="Width" Value="7" />
            <Setter Property="Height" Value="7" />

            <Style.Triggers>
                <Trigger Property="IsEnabled" Value="False">
                    <Setter Property="Fill" Value="Red" />
                </Trigger>

                <Trigger Property="IsMouseOver" Value="True">
                    <Setter Property="Opacity" Value="1" />
                    <Setter Property="Width" Value="10" />
                    <Setter Property="Height" Value="10" />
                    <Setter Property="Margin" Value="0" />
                </Trigger>
            </Style.Triggers>
        </Style>
    </UserControl.Resources>

    <UserControl.Triggers>
        <EventTrigger RoutedEvent="to:GBPlayerPath.Activated">
            <BeginStoryboard Name="ppp">
                <Storyboard>
                    <DoubleAnimation Storyboard.TargetName="_path" Storyboard.TargetProperty="StrokeThickness" From="2" To="5" AutoReverse="True" RepeatBehavior="Forever" />
                    <DoubleAnimation Storyboard.TargetName="_path" Storyboard.TargetProperty="Opacity" SpeedRatio="0.7" From="0.6" To="1" AutoReverse="True" RepeatBehavior="Forever" />
                </Storyboard>
            </BeginStoryboard>
        </EventTrigger>
        
        <EventTrigger RoutedEvent="to:GBPlayerPath.Deactivated">
            <StopStoryboard BeginStoryboardName="ppp" />
            <BeginStoryboard Name="ppp2">
                <Storyboard>
                    <DoubleAnimation Storyboard.TargetName="_path" Storyboard.TargetProperty="StrokeThickness" To="2" />
                    <DoubleAnimation Storyboard.TargetName="_path" Storyboard.TargetProperty="Opacity" To="0.5" />
                </Storyboard>
            </BeginStoryboard>
        </EventTrigger>
        
    </UserControl.Triggers>

    <Canvas>
        <Path Stroke="{Binding Path=BrushColor}" StrokeThickness="2" x:Name="_path" Opacity="0.3">
            <Path.Data>
                <PathGeometry>
                    <PathFigure StartPoint="5,6"  x:Name="_pathFigure">
                        <LineSegment  x:Name="_line"/>
                    </PathFigure>
                </PathGeometry> 
            </Path.Data>
            <Path.Triggers>               
                
                <EventTrigger RoutedEvent="Path.Loaded">
                    <BeginStoryboard Name="MyBeginStoryboard">
                        <Storyboard>
                            <PointAnimation Name="_pointAnimation"
                Storyboard.TargetProperty="Point"
                Storyboard.TargetName="_line"
                Duration="0:0:0.3"  RepeatBehavior="1x" />
                        </Storyboard>
                    </BeginStoryboard>
                </EventTrigger>
            </Path.Triggers>

        </Path>
        <ItemsControl ItemsSource="{Binding PossibleMoves}">
            <ItemsControl.ItemTemplate>
                <DataTemplate>
                    <TextBlock>fd</TextBlock>
                </DataTemplate>
            </ItemsControl.ItemTemplate>
        </ItemsControl>
        <Border Visibility="Collapsed" x:Name="_nextMovePreview" Width="20" Height="20">
            <Canvas x:Name="_nextMoveCanvas">
                <Ellipse Fill="{Binding Path=BrushColor}" x:Name="_nextMove11" Style="{StaticResource MoveEllipseStyle}" Canvas.Top="-5" Canvas.Left="-5" />
                <Ellipse Fill="{Binding Path=BrushColor}" x:Name="_nextMove12" Style="{StaticResource MoveEllipseStyle}" Canvas.Top="-5" Canvas.Left="5" />
                <Ellipse Fill="{Binding Path=BrushColor}" x:Name="_nextMove13" Style="{StaticResource MoveEllipseStyle}" Canvas.Top="-5" Canvas.Left="15" />
                <Ellipse Fill="{Binding Path=BrushColor}" x:Name="_nextMove21" Style="{StaticResource MoveEllipseStyle}" Canvas.Top="5" Canvas.Left="-5" />
                <Ellipse Fill="{Binding Path=BrushColor}" x:Name="_nextMove22" Style="{StaticResource MoveEllipseStyle}" Canvas.Top="5" Canvas.Left="5" />
                <Ellipse Fill="{Binding Path=BrushColor}" x:Name="_nextMove23" Style="{StaticResource MoveEllipseStyle}" Canvas.Top="5" Canvas.Left="15" />
                <Ellipse Fill="{Binding Path=BrushColor}" x:Name="_nextMove31" Style="{StaticResource MoveEllipseStyle}" Canvas.Top="15" Canvas.Left="-5"  />
                <Ellipse Fill="{Binding Path=BrushColor}" x:Name="_nextMove32" Style="{StaticResource MoveEllipseStyle}" Canvas.Top="15" Canvas.Left="5"  />
                <Ellipse Fill="{Binding Path=BrushColor}" x:Name="_nextMove33" Style="{StaticResource MoveEllipseStyle}" Canvas.Top="15" Canvas.Left="15" />
            </Canvas>
        </Border>
        <Rectangle Fill="Green" Opacity="0.8" Width="10" Height="10" Visibility="Collapsed" x:Name="_bestMove" Margin="-5,-5,0,0" />
    </Canvas>
</UserControl>
